.main{
  width: 1200px;
  margin: 0 auto;
  display: flex;
  .categery{
    border: 2px solid #Fba35b;
    width: 20%;
    margin-top: 28px;
    margin-right: 20px;
    margin-left: 0;
    >h3{
      background: #Fba35b;
      padding: 10px;
    }
    ul{
      li{
        display: block;
        float: none;
        width: 100%;
        text-align: left;
        padding: 5px 15px;
        box-sizing: border-box;
        a{
          display: flex;
          justify-content: space-between;
          align-items: center;
          color: #333;
          font-size: 18px;
          span,i{
            margin: 0;
          }
          i{
            display: inline-block;
            width: 20px;
            height: 20px;
            background: url(../images/right.png);
            background-size: cover;
          }
        }
      }
    }
  }
  .item-list{
    margin: 28px 0 0;
    .item{
      display: flex;
      margin-top: 10px;
      .pic{
        margin-right: 20px;
        >img{
          padding: 20px;
          border: 2px solid #f2f2f2;
        }
        .star{
          display: inline-block;
          width: 65px;
          height: 12px;
          background: url('../images/icon_clubs.gif') no-repeat;
        }
      }
      .info{
        flex: 1;
        .item-info{
          >p{
            line-height: 30px;
            >s{
              color: #ddd;
            }
          }
          .red{
            color: red;
          }
        }
        .buy{
          background: #fffceb;
          border: 2px solid #f6f0d6;
          .num{
            border-bottom: 2px dashed #f6f0d6;
            margin: 10px;
            padding-bottom: 10px;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            >span{
              margin: 0;
              margin-right: 10px;
            }
            .sub,.add{
              display: inline-block;
              width: 30px;
              height: 30px;
              background: #FFF;
              border-radius: 50%;
              border: 2px solid #d2d2d2;
              font-size: 20px;
              margin: 0;
              cursor: pointer;
            }
            .number{
              height: 30px;
              width: 30px;
              text-align: center;
              margin: 0 5px;
            }
            input::-webkit-outer-spin-button,
            input::-webkit-inner-spin-button {
              -webkit-appearance: none;
            }
            input[type="number"]{
              -moz-appearance: textfield;
            }
          }
          .add-btn{
            margin: 10px;
            .add-cart{
              display: inline-block;
              width: 136px;
              height: 39px;
              background: url('../images/btn_new.jpg') no-repeat;
              cursor: pointer;
            }
            .add-notice{
              display: inline-block;
              width: 68px;
              height: 30px;
              background: url('../images/btn_attention.jpg') no-repeat;
              cursor: pointer;
            }
          }
        }
      }
    }
  }
}
#footer{
  width: 100%;
  margin-top: 100px;
  // height: 429px;
  .footer_top{
      height: 228px;
      border-bottom: 1px solid #e8e8e8;
      .footer_top_content{
        border-top: 2px solid #ce3c3d;
          width: 1200px;
          margin: 0 auto;
          display: flex;
          aside{
              width: 246px;
              box-sizing: border-box;
              margin: 15px;
              border-right: 1px solid #dedede;
              h3{
                  font-size: 14px;
                  color: #999;
              }
              em{
                  color: #bd0f19;
                  font-style: normal;
                  font-size: 20px;
                  line-height: 24px;
              }
              p{
                  font-size: 12px;
                  color: #999 ;
              }
              figure{
                  display: inline-block;
                  margin-top: 10px;
                  width: 77px;
                  background: #fff;
                  border: 1px solid #d9d9d9;
                  figcaption{
                      padding: 9px;
                  }
                  p{
                      padding: 6px;
                      padding-top: 0;
                      font-size: 12px;
                      color: #b3b3b3;
                      text-align: center;
                  }
              }
          }
          article{
              margin: 15px;
              flex: 1;
              .footer_top_content_article_top{
                  display: flex;
                  margin-bottom: 26px;
                  div{
                      flex: 1;

                  }
              }
              .footer_top_content_article_bottom{
                  display: flex;
                  ul{
                      flex: 1;
                      li{
                          font-size: 12px;
                          color: #999999;
                          line-height: 18px;
                          float: none;
                          text-align: left;
                          width: 100%;
                          &:first-child{
                              font-size: 14px;
                              color: #666666;
                              padding-bottom: 10px;
                              font-weight: bold;
                          }
                      }
                  }
              }
          }
      }
  }
  .footer_bottom{
      background: #f8f8f8;
      text-align: center;
      padding: 10px 0 20px;
      p{
          a{
              margin-top: 20px;
              margin-bottom: 20px;
              display: inline-block;
              padding: 0 10px;
              border-right: 1px solid #ccc;
              font-size: 12px;
              color: #787878;
          }
      }
      span{
          color: #787878;
          font-size: 12px;
          
      }
  }
}